<template>
  <el-select
    v-model="selectedValue"
    v-bind="$attrs"
    @change="handleChange"
    :placeholder="placeholder"
    filterable
    clearable
  >
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value"
    />
  </el-select>
</template>
<script>
import _ from "lodash";
import { listUser } from "@/api/system/user";

export default {
  name: "campusSelect",
  props: {
    value: {
      type: [String, Number, Array],
      default: "",
    },
    placeholder: {
      type: String,
      default: "请选择所属顾问",
    },
  },
  data() {
    return {
      selectedValue: this.value,
      options: [], // 姓名选项
    };
  },
  watch: {
    value(newVal) {
      this.selectedValue = newVal;
    },
  },
  methods: {
    //获取校区数据
    getData() {
      listUser().then((res) => {
        this.options = _.map(res.rows, (item) => {
          return {
            label: item.nickName,
            value: item.userId,
          };
        });
        // 如果有默认值，设置选中值
        if (this.value) {
          this.selectedValue = this.value;
        }
      });
    },
    handleChange(value) {
      this.$emit("input", value);
      this.$emit("change", value);
    },
  },
  mounted() {
    this.getData();
  },
};
</script>
